<template>
  <div class="ArticleList">
    <van-pull-refresh v-model="refreshing_t" @refresh="onRefresh">
      <van-list
        v-model="loading_t"
        :finished="finished_t"
        finished-text="没有更多了"
        @load="onLoad"
      >
      
      <ArticleItem v-for="(item) in datas" :key="item.id" :item="item" ></ArticleItem>
      </van-list>
    </van-pull-refresh>
  </div>
</template>

<script>
import ArticleItem from '@/components/ArticleItem.vue'
export default {
    components:{
      ArticleItem,
    },
    data(){
      return{
        refreshing_t:false,
        loading_t:false,
        finished_t:false
      }
    },
    props:{
      datas:{
        type:Array,
        default(){
          return []
        }
      },
      obj:{
        type:Object,
        default(){
          return {}
        }
      }
    },
    created() {
      // this.getData()
      this.refreshing_t=this.obj.refreshing,
      this.loading_t=this.obj.loading,
      this.finished_t=this.obj.finished
    },
    methods: {
      onRefresh(){
        this.$emit('refresh')
      },
      onLoad(){
        this.$emit('onLoad')
      }
    },
    watch:{
      'obj.loading'(){
        this.refreshing_t=this.obj.refreshing,
        this.loading_t=this.obj.loading,
        this.finished_t=this.obj.finished
      }
    }
}
</script>

<style scoped >
    .ArticleList:last-child{
        margin-bottom: 40px;
      }
</style>